<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ include file="../../../attr.jsp" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!doctype html>
<html>
<meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="${ctx}/css/sapar.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/css/common.css" />
<script type="text/javascript" src="${ctx}/js/jquery.js"></script>
<script type="text/javascript" src="${ctx}/js/sapar.js"></script>
<script type="text/javascript" src="${ctx}/js/WdatePicker.js"></script>
<script type="text/javascript" src="${ctx}/assets/layer/layer.js"></script>
<script type="text/javascript" src="${ctx}/js/kkpager.min.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx}/css/kkpager_blue.css" />
<title>器械档案</title>
<style type="text/css">
th{
text-align: center;
}
td{
text-align: center;
}
</style>
<style>
#shushu{
color:red;
font-weight:bold;
}
</style>
</head>

<body>
    <div id="saper-container">
        <div id="saper-hd"></div>
        <div id="saper-bd">
            <div class="subfiled clearfix">
                <h2>器械档案</h2>
            </div>
            <div class="subfiled-content">
                <div class="search-box clearfix">
                    <div class="kv-item clearfix">
                        <label>搜索条件：</label>
                        <div class="kv-item-content">
                            <input type="text" name="searchTxt" placeholder="名字/速记码/编号" value="${id}" class="search_text">
                        </div>
                    </div>

                    <div style="margin-left: 40px" class="kv-item-content">
                        <select onchange="selectBytype()" class="empty" id="dictId" name="dictId">
                            <option value="0">全部</option>
                            <c:forEach items="${productTypeList}" var="productType">
                                <option value="${productType.dictId}"
                                        <c:if test="${dictId==productType.dictId}">selected="true"</c:if>  >${productType.dictName}</option>
                            </c:forEach>
                        </select>
                    </div>

                    <a href="javascript:;" class="sapar-btn sapar-btn-recom query-btn">查询</a>
                </div>
                <!--表格开始-->
                <div class="table">
                    <!--表格操作-->
                    <div class="table-operate ue-clear">
						<a href="javascript:;" class="add">添加到包</a>
                    </div>
                    <!--表格具体内容-->
                    <div class="table-box">
                        <table>
                            <thead>
                                <tr>
                                  <th><input type="checkbox" id="checkall" name="checkall"/></th>
								  <th class="text-left">物品编号</th>  
			                      <th class="text-left">物品名称</th>  
			    				  <th class="text-left">物品速记码</th>
			    				  <th class="text-left">物品尺寸</th>
			    				  <th class="text-left">物品规格</th>
			    				  <th class="text-left">物品功能</th>
                                </tr>
                            </thead>
                            <tbody>
                            	<c:if test="${productList != null}">
                            	<c:forEach items="${productList}" var="qixie">
                                <tr >
									<td><input type="hidden" value="${qixie.productId}"/><input type="text" name="key" style="width: 50px;height:20px " /></td>
									<td>${qixie.productId}</td>
									<td>${qixie.productName}</td>
									<td>${qixie.productCode}</td>
									<td>${qixie.productSize}</td>
									<td>${qixie.productBarcode}</td>
									<td>${qixie.productFunction}</td>
                                </tr>
                                </c:forEach>
                                </c:if>
                            </tbody>
                        </table>
                    </div>
                </div><!--表格结束-->
            </div>
        </div>
        <div id="saper-ft">
       	 	<div id="kkpager"></div>
        </div>
    </div>
    
</body>

<script type="text/javascript">
var productJson = ${productJson};
var arra = [] ;
	$(function(){
		var changjia = <%=request.getAttribute("val") %>;
		var totalPage = ${total};
		var pageNo = getParameter('pageIndex');
		if(!pageNo){
			pageNo = 1;
		}
		//生成分页
		//有些参数是可选的，比如lang，若不传有默认值
		kkpager.generPageHtml({
			pno : pageNo,
			//总页码
			total : totalPage,
			//链接前部
			hrefFormer : '${ctx}/shoushumuban/qixieDetailList',
			//链接尾部
			hrefLatter : '.do',
			getLink : function(n){
				return this.hrefFormer + this.hrefLatter + "?pageIndex="+n+"&id="+$(".search_text").val()+"&changjia="+changjia;
			}
		});
		
		$(".query-btn").click(function(){
            var dictId = $("#dictId").val();
			window.location.href="${ctx}/shoushumuban/qixieDetailList.do?id="+$(".search_text").val()+"&dictId="+dictId;
		});
 
		<%--点添加到手术包用到的事件--%>
		$(".add").click(function(){
			var chk_value = getSelRecord();
			var index = parent.layer.getFrameIndex(window.name);
			if(chk_value.length > 0){
				 console.log(arra);
				 <%--父页面调用回调--%>
				 parent.callbackData(arra);
			}else{
				layer.msg('请选择要添加的数据！');
			}
		});
		
		$("#checkall").click(function(){
   		    if(this.checked){
   		        $("input[name='key']").prop('checked', true)
   		    }else{
   		        $("input[name='key']").prop('checked', false)
   		    }
	    });
	});
    function selectBytype() {
        $(".query-btn").click();
    }

	<%--找到所有选择的数据--%>
	function getSelRecord(){
		arra = [];
		var chk_value =[];

		$('input[name="key"]').each(function(){
		    var that = this;
            if($(that).val()!=''){
                var productId = $(that).prev().val();
                chk_value.push(productId);
                var num = $(that).val();
                var key = productId+"";
                var tempObj = productJson[key];
                tempObj.num = num;
                arra.push(tempObj);
            }
		});
		return chk_value;
	}  
	
  	function getParameter(name) { 
		var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); 
		var r = window.location.search.substr(1).match(reg); 
		if (r!=null) return unescape(r[2]); return null;
	}
</script>
</html>